/*! 导航栏*/
$f-size12:12px;
/*!顶部导航栏*/
.top-nav{
    position: relative;
    z-index: 103;
    height: 30px;
    line-height: 27px;
    background-color: #f5f5f5;
    color: #777;
    font-size: $f-size12;
    /* 版心*/
    .c-top-nav{
        .h-address{
            /*!地址栏*/
            position: relative;
            z-index: 10;
            vertical-align: top;
            color: #333;
            float: left;
            /*!外面显示的省份*/
            .top-area{
                position: relative;
                z-index: 1;
                padding-left: 15px;
                padding-right: 23px;
                width: 46px;
                height: 27px;
                cursor: pointer;
                border-width: 1px 1px 0;
                border-style: solid;
                border-color: #f5f5f5;
                .area-tittle{
                    display: block;
                    line-height: 27px;
                    white-space: nowrap;
                    text-overflow: ellipsis;
                    overflow: hidden;
                }
                >span{
                    position: absolute;
                    top: 10px;
                    right: 10px;
                    display: inline-block;
                    width: 0;
                    height: 0;
                    border-width: 4px;
                    border-color: #999 transparent transparent transparent;
                    border-style: solid;
                    vertical-align: top;
                }
            }
            /*! 隐藏的列表*/
            .top-area-list{
                display: none;
                position: absolute;
                top: 28px;
                left: 0;
                padding-right: 15px;
                padding-left: 15px;
                width: 470px;
                background-color: #fff;
                border: 1px solid #ccc;
                p{
                    padding-top: 7px;
                    padding-bottom: 7px;
                }
                // 省份、城市地区列表
                .area-table{
                    a{
                        color: #333;
                    }
                    .area-table-header{
                        height: 29px;
                        li{
                            float: left;
                            margin-left: -1px;
                            width: 68px;
                            text-align: center;
                            cursor: pointer;
                            line-height: 28px;
                            vertical-align: top;
                            border: 1px solid #ccc;
                            background-color: #f8f8f8;
                        }
                    }
                    .area-table-body{
                        padding: 20px 13px 18px;
                        border-top: 1px solid #ccc;
                        // 省份
                        .province-list{
                            width: 408px;
                            // display: none;
                            li{
                                width: 68px;
                                float: left;
                                margin-bottom: 2px;
                                
                            }
                            a{
                                display: inline-block;
                                padding-right: 10px;
                                padding-left: 10px;
                                white-space: nowrap;
                                text-overflow: ellipsis;
                                overflow: hidden;
                                line-height: 20px;
                                border: 1px solid #fff;
                                }
                            a:hover{
                                    color: #f10180;
                                    border-color: #f10180;
                                }
                            }
                        }
                        // 城市
                        .city-list{
                            width: 412px;
                            li{
                                width: 103px;
                                float: left;
                                margin-bottom: 2px;
                            }
                            a{
                                display: inline-block;
                                padding-right: 10px;
                                padding-left: 10px;
                                white-space: nowrap;
                                text-overflow: ellipsis;
                                overflow: hidden;
                                line-height: 20px;
                                border: 1px solid #fff;
                            }
                            a:hover{
                                color: #f10180;
                                border-color: #f10180;
                            }
                        }
                    }
                }
                /*!删除按钮*/
                span{
                    position: absolute;
                    top: 14px;
                    right: 14px;
                    font-size: 26px;
                    color: #8b8a8b;
                    cursor: pointer;
                }
            }
        }
        /*!头部列表*/
        .nav-tool{
            float: right;
            i{
                display: inline-block;
            }
            li{
                float: left;
                position: relative;
                padding: 0 10px;
                border: transparent 1px solid;   
                 /*!每个li后面都有 */
                &::after{
                    content: "";
                    background-image: url(../imgs/topnav/精灵图.png);
                    background-position: -207px -184px;
                    width: 16px;
                    height: 16px;
                    position: absolute;
                    top: 6px;
                    right: -5px;
                }
                li:last-child::after{
                    content: "";
                }
                >span{
                    padding: 0 5px;
                    a{
                        color: #666;
                    }
                    /*! 小礼物图标*/
                    .qd-img{
                        position: relative;
                        top: 2px;
                        width: 15px;
                        height: 18px;
                        background: url(../imgs/topnav/签到.gif) no-repeat;
                        margin-right: 3px;
                        border: none;
                    }
                    .phon-ico{
                        background-image: url(../imgs/topnav/精灵图.png);
                        background-position: -294px -142px;
                        width: 10px;
                        height: 14px;
                        margin-left: 1px;
                        margin-right: 3px;
                        margin-top: -3px;
                        vertical-align: middle;
                    }
                }
                >span:hover a{
                    cursor: pointer;
                    color: #f10180;
                }
                .qd:hover{
                    cursor: pointer;
                    color: #777777;
                }
            }
            // /有下拉菜单的li
            .service{
                // 倒三角
                .trian i{
                    margin-top: 5px;
                    width: 0;
                    height: 0;
                    line-height: 0;
                    vertical-align: middle;
                    border-width: 4px;
                    border-color: #999 transparent transparent transparent;
                    border-style: solid dashed dotted dashed;
                }
                // 划过时三角向上
                .trian:hover i{
                    margin-top: 0;
                    margin-bottom: 5px;
                    border-style: solid;
                    border-color: transparent transparent #f10180 transparent;
                }
                >span:hover{
                    cursor: pointer;
                    color: #f10180;
                }
            }
            .service:hover{
                border: 1px solid #cdcdcd;
                border-bottom: none;
                background: #fff;
            }
            
        }
       
    }

/*!头部logo+搜索框*/
.head-logo{
    height: 100px;
    background-color: #fff;
    /*! logo版心*/
    .header-c{
        font-size: $f-size12;
        /*! logo*/
        .c-logo{
            position: relative;
            float: left;
            z-index: 1;
            margin-right: 1px;
            min-width: 140px;
            height: 100px;
            a{
                margin-left: -20px;
                min-width: 160px;
                img{
                    height: 100px;
                }
            }
        }
        /*!100天，vip */
        .header-vip{
            float: left;
            background-image: url(../imgs/topnav/100天vip.jpg);
            background-size: contain;
            position: relative;
            z-index: 1;
            width: 304px;
            height: 100px;

        }
        /*! 搜索框*/
        .c-serch{
            float: right;
            position: relative;
            margin-top: 33px;
            width: 391px;
            /*!搜索框input*/
            .serch-form{
                position: relative;
                width: 387px;
                height: 32px;
                border: 2px solid #fa2a83;
                border-radius: 2px;
                background-color: #fff;
                input{
                    padding: 2px 12px;
                    width: 311px;
                    height: 28px;
                    line-height: 30px;
                    font-size: 14px;
                    color: #333;
                    border: none;
                    border-top-left-radius: 2px;
                    border-bottom-left-radius: 2px;
                    background-color: #fff; 
                }
                a{
                    position: absolute;
                    top: 0;
                    right: 0;
                    padding-top: 6px;
                    width: 53px;
                    height: 26px;
                    text-align: center;
                    background-color: #fa2a83;
                    border-top-right-radius: 0;
                    border-bottom-right-radius: 0;
                    span{
                        background-image: url(../imgs/topnav/精灵图.png);
                        background-position: -285px -104px;
                        width: 19px;
                        height: 22px;
                        display: inline-block;
                    }
                }
            }
            /*! 搜索框下面的列表*/
            .serch-list{
                height: 20px;
                overflow: hidden;
                margin: 2px;
                li{
                    display: inline-block;
                    margin-right: 6px;
                    color: #999;
                    span{
                        margin-right: 6px;
                        color: #ccc;
                    }
                    a{
                        color: #999;
                    }
                }
            }

        }
        /*! 购物车*/
        .shop{
            position: relative;
            z-index: 9;
            float: right;
            margin-top: 33px;
            margin-left: 15px;
            width: 96px;
            .car{
                position: relative;
                z-index: 1;
                padding-right: 33px;
                padding-left: 25px;
                width: 36px;
                height: 32px;
                line-height: 32px;
                cursor: pointer;
                border: 1px solid #ccc;
                background-color: #f6f7f9;
                border-radius: 2px;
                /*! 外部商品数量*/
                a{
                    color: #333;
                    /*! 购物车图标*/
                    .car-ico{
                        background-image: url(../imgs/topnav/精灵图.png);
                        background-position: 0 -208px;
                        width: 12px;
                        height: 17px;
                        position: absolute;
                        top: 8px;
                        left: 8px;
                        z-index: 1;
                    }
                    .car-num-bg{
                        position: absolute;
                        top: 8px;
                        right: 3px;
                        z-index: 1;
                        border-radius: 8px;
                        height: 16px;
                        width: 24px;
                        line-height: 16px;
                        color: #fff;
                        text-align: center;
                        background-color: #f00581;
                    }
                }
                
            }
        }
       
        
    }
}

/*!主要导航 */
.main-nav {
    height: 42px;
    line-height: 42px;
    background-color: #fff;
    font-size: 14px;
    color: #fff;
    z-index: 50;
    box-sizing: border-box;
    width: 100%;
    transition: .3s linear;
    top: 0;
    transform: translateZ(0);
    box-shadow: 0 1px 3px 0 #a7a7a7;
    position: sticky;
    // 版心
    .main-nav-c{
        // 商品分类导航
        .main-nav-link{
            height: 42px;
            li{
                float: left;
                position: relative;
                height: 42px;
                a{
                    display: block;
                    padding: 0 10px;
                    text-align: center;
                    color: #333;
                    font-size: 16px;
                    white-space: nowrap;
                }
            }
            /*!商品分类*/
            .shop-class{
                background-color: #f10180;
                width: 156px;
                height: auto;
                margin-right: 20px;
                a{
                    color: #fff;
                    height: 42px;
                }
                a:hover{
                    color: #fff;
                }
            }
            // 推荐
            .class-li_0 a{
                cursor: default;
                font-weight: 700;
                color: #f10180;
            }
            li>a:hover{
                color: #f10180;
            }
            /*!更多*/
            .class-more{
                position: relative;
                cursor: pointer;
                font-size: 16px;
                width: 86px;
                text-align: center;
                a{
                    position: relative;
                    span{
                        display: block;
                        position: absolute;
                        right: 15px;
                        top: 20px;
                        width: 0;
                        height: 0;
                        line-height: 0;
                        border-width: 4px;
                        border-color: #999 transparent transparent transparent;
                        border-style: solid dashed dotted dashed;
                    }
                }
            }
        }
        .main-nav-data{
            position: absolute;
            z-index: 2;
            color: #fff;
            // 二级菜单
            .menue{
                display: none;
                overflow: hidden;
                width: 156px;
                z-index: 666;
                background-color: #f10180;
                height: 495px;
                -webkit-transition: .2s linear;
                transition: .2s linear;
                padding: 0 0 1px;
                box-shadow: -2px 2px 3px rgb(0 0 0 / 10%);
                .menue-item{
                    text-align: left;
                    padding-left: 35px;
                    overflow: hidden;
                    height: 45px;
                    line-height: 45px;
                    float: none;
                    span{
                        font-size: 12px;
                    }
                }
                .menue-item:hover{
                    background-color: #fff;
                    color: #f10180;
                    cursor: pointer;
                }
            }
            // 二级菜单对应的选项卡  menue-item => cont
            .pop{
                // display: block;
                display: none;
                background-color: #fff;
                position: absolute;
                left: 156px;
                top: 0;
                width: 844px;
                height: 495px;
                // box-shadow: 2px 2px 3px 0 rgb(0 0 0 / 10%);
                .part{
                    display: block;
                    position: relative;
                    width: 100%;
                    height: 100%;
                    top: 0;
                    left: 0;
                    // 左边的
                    .part-c1{
                        float: left;
                        width: 519px;
                        padding: 16px 40px 16px 40px;
                        max-height: 462px;
                        border-top: 1px solid #eee;
                        overflow: hidden;
                        .cont{
                            .cont-item{
                                margin-bottom: 24px;
                                position: relative;
                                font-size: 12px;
                                display: block;
                                .cont-tittle{
                                    line-height: 22px;
                                    position: absolute;
                                    left: 0;
                                    width: 83px;
                                    color: #222;
                                    overflow: hidden;
                                    i{
                                        width: 10px;
                                        vertical-align: middle;
                                        float: right;
                                        font-size: 12px;
                                        font-weight: bolderz;
                                    }
                                    span{
                                        overflow: hidden;
                                        text-overflow: ellipsis;
                                        white-space: nowrap;
                                        display: inline-block;
                                        width: 72px;
                                        font-weight: 700;
                                        }
                                    }
                                .cont-txt{
                                        line-height: 22px;
                                        width: 425px;
                                        margin-left: 95px;
                                        overflow: hidden;
                                        word-break: keep-all;
                                        a{
                                            color: #666;
                                            margin-right: 10px;
                                        }
                                        a:hover{
                                            color: #f10180;
                                        }
                                }
                            }
                        }
                        
                    }
                    .part-c2{
                        float: right;
                        background-color: #f5f5f5;
                        width: 213px;
                        height: 463px;
                        padding: 16px;
                        .c2-box{
                            .brand-tittle{
                                font-size: 12px;
                                color: #222;
                                line-height: 21px;
                                margin-bottom: 28px;
                            }
                            .brand-box{
                                width: 220px;
                                height: 220px;
                                background-image: url(../imgs/mainnav-menu/0.png) ;
                                background-size: 220px 220px;
                            }
                        }
                    }
                }
            }
        }
    }
}

/*!banner*/
.banner-img{
    position: relative;
    background-repeat: no-repeat;
    background-position: center top;
    background-image: url(../imgs/banner/banner-img.jpg);
    .banner{
        padding-top: 30px;
        padding-bottom: 20px;
        position: relative;
        margin-bottom: 10px;
        // 透明小背景
        .banner-c{
            padding: 12px;
            padding-bottom: 0;
            background: rgba(255,255,255,.86);
            width: 976px;
            position: relative;
            margin: 0 auto;
            box-shadow: 0 1px 3px rgb(167 167 167 / 40%);
            /*!主banner内容*/
            .banner-con{
                width: 976px;
                border-bottom: none;
                height: 380px;
                margin: 0 auto;
                position: relative;
                overflow: hidden;
                .fbc-list{
                    overflow: hidden;
                    height: 340px;
                    .fbc-list-item{
                        position: absolute;
                        top: 0;
                        left: 0;
                        img{
                            height: 340px;
                        }
                    }
                }
                // 按钮
                .fbc-btn{
                    border-radius: 2px;
                    position: absolute;
                    width: 33px;
                    height: 66px;
                    line-height: 66px;
                    font-size: 24px;
                    cursor: pointer;
                    top: 50%;
                    margin-top: -53px;
                    z-index: 2;
                    text-align: center;
                    // -webkit-transition: all .3s ease-in;
                    transition: all .5s;
                    background: rgba(0,0,0,.2);
                }
                .fbc-pre-btn{
                    left: -33px;
                    &:hover{
                        background: rgba(0,0,0,.5);
                        color: #fff;
                    }
                }
                .fbc-next-btn{
                    right: -33px;
                    font-size: 26px;
                    &:hover{
                        background: rgba(0,0,0,.5);
                        color: #fff;
                    }
                }
                &:hover .fbc-pre-btn{
                    left: 0;
                }
                &:hover .fbc-next-btn{
                    right: 0;
                }
            }
        }
        .fbc-check{
            /*!广告对应的tittle*/
            text-align: center;
            width: 976px;
            left: 50%;
            margin-left: -488px;
            height: 40px;
            position: absolute;
            bottom: 20px;
            .fbc-tittle{
                width: 100%;
                height: 40px;
                text-align: center;
                li{
                    display: inline-block;
                    width: 195px;
                    overflow: hidden;
                    text-overflow: ellipsis;
                    white-space: nowrap;
                    height: 40px;
                    font: 12px/40px 'microsoft Yahei';
                    color: #666;
                    cursor: pointer;
                    border-bottom: transparent 3px solid;
                    position: relative;
                    box-sizing: border-box;
                    z-index: 22;
                    &:first-child::after{
                        content: "|";
                        font-family: tohama;
                        font-size: 10px;
                        margin-left: 10px;
                        color: #e8e8e8;
                        position: absolute;
                        right: 0;
                    }
                }
            }
        }
    }
}

/*!美妆*/
.beauty{
    background-color: #fff;
    .beauty-box{
        font-size: 10px;
        .beauty-box>*{
            box-sizing: border-box;
            padding: 0;
            margin: 0;
        }
        .beauty-content{
            width: 995px;
            height: 315px;
            cursor: pointer;
            padding-bottom: 20px;
            img{
                display: block;
            }
            .beauty-tittle{
                width: 995px;
                height: 102px;
                
            }
            .tittle,.list_0,.list_1,.list_2{
                border-radius: 0px;
                overflow: hidden;
                object-fit: cover;
                position: absolute;
            }
            .list_0{
                z-index: 1;
                left: 0px;
                top: 102px;
                width: 321px;
                height: 213px;
            }
            .list_1{
                z-index: 2;
                left: 337px;
                top: 102px;
                width: 321px;
                height: 213px;
            }
            .list_2{
                z-index: 3;
                left: 673px;
                top: 102px;
                width: 321px;
                height: 213px;
            }
        }
    }
}

/*!每日必看*/
.must-look{
    width: 1000px;
    margin: 0 auto;
    padding-bottom: 20px;
    .must-look-tittle{
        margin-bottom: 20px;
        img{
            width: 100%;
        }
    }
    .must-look-option{
        width: 1000px;
        margin: 0 auto;
        padding-bottom: 20px;
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
        // op-1..op-4
        >div{
            width: 485px;
            height: 282px;
            margin-bottom: 10px;
            white-space: nowrap;
            overflow: hidden;
            position: relative;
            box-sizing: border-box;
            cursor: pointer;
            // 三个一个品牌.op-box
            .op-box{
                width: 440px;
                height: 220px;
                margin: 60px 20px 0;
                display: flex;
                justify-content: space-between;
                >div{
                    width: 142px;
                    height: 200px;
                    background-size: 145px 145px;
                    background-repeat: no-repeat;
                    position: relative;
                    font-size: 10px;
                    // 白色背景
                    .op-white{
                        background-image: url(../imgs/must-look/111.png);
                        background-size: contain;
                        left: 20px;
                        top: 110px;
                        width: 104px;
                        height: 65px;
                        border-radius: 4px;
                        overflow: hidden;
                        position: absolute;
                        position: relative;
                        // z-index: 60;
                        .op-logo{
                            left: 20px;
                            top: 8px;
                            width: 68px;
                            height: 34px;
                            overflow: hidden;
                            display: block;
                            position: absolute;
                        }
                        .op-name{
                            margin: 47px auto 0;
                            text-align: center;
                        }
                    }
                    .op-price{
                        position: absolute;
                        width: 104px;
                        height: 21px;
                        line-height: 21px;
                        left: 20px;
                        top: 180px;
                        .price-title{
                            display: inline-block;
                            width: 43px;
                            height: 21px;
                            border-radius: 40px;
                            background-color: rgb(240, 56, 103);
                            color: rgb(255, 255, 255);
                            text-align: center;
                            vertical-align: text-bottom;
                        }
                        .price-text{
                            font-size: 14px;
                        }
                    }   
                }
            }
        }
        .op-1{
            background-image: url(../imgs/must-look/1/000.jpg);
            background-size: cover;
            .op-bg-1{
                background-image: url(../imgs/must-look/1/og-1/1.jpg);
            }
            .op-bg-2{
                background-image: url(../imgs/must-look/1/og-2/2.jpg);
            }
            .op-bg-3{
                background-image: url(../imgs/must-look/1/og-3/3.jpg);
            }
        }
        .op-2{
            background-image: url(../imgs/must-look/2/000.jpg);
            background-size: cover;
            .op-bg-1{
                background-image: url(../imgs/must-look/2/og-1/1.jpg);
            }
            .op-bg-2{
                background-image: url(../imgs/must-look/2/og-2/2.jpg);
            }
            .op-bg-3{
                background-image: url(../imgs/must-look/2/og-3/3.jpg);
            }
        }
        .op-3{
            background-image: url(../imgs/must-look/3/000.jpg);
            background-size: 508px 282px;
            >div{
                margin-top: 80px;
            }
            .op-bg-1{
                background-image: url(../imgs/must-look/3/og-1/1.jpg);
            }
            .op-bg-2{
                background-image: url(../imgs/must-look/3/og-2/2.jpg);
            }
            .op-bg-3{
                background-image: url(../imgs/must-look/3/og-3/3.jpg);
            }
        }
        .op-4{
            background-image: url(../imgs/must-look/4/000.png);
            background-size: 485px 282px;
            >div{
                margin-top: 80px;
            }
            .op-bg-1{
                background-image: url(../imgs/must-look/4/og-1/1.jpg);
            }
            .op-bg-2{
                background-image: url(../imgs/must-look/4/og-2/2.jpg);
            }
            .op-bg-3{
                background-image: url(../imgs/must-look/4/og-3/3.jpg);
            }
        }
    }
}

/*!打折*/
.zhe{
    position: relative;
    overflow: hidden;
    width: auto;
    .shop-sort{
        width: 1000px;
        margin: 0 auto 20px;
        .shop-list{
            width: 1010px;
            display: flex;
            justify-content: space-between;
            flex-wrap: wrap;
            .item{
                margin-bottom: 50px;
                a{
                    display: block;
                    width: 490px;
                    height: 280px;
                    img{
                        width: 490px;
                        height: 235px;
                    }
                    .sort-txt{
                        margin-top: 16px;
                        cursor: pointer;
                        font-family: MicrosoftYaHei;
                        font-weight: 700;
                        font-size: 16px;
                        color: #333;
                        overflow: hidden;
                        text-overflow: ellipsis;
                        white-space: nowrap;
                        width: 455px;
                        .sort-num{
                            color: #f03867;
                            font-size: 18px;
                        }
                    }
                }
            }
        }
        .show-more{
            width: 200px;
            height: 44px;
            margin: 20px auto 0;
            span{
                background-color: #f10180;
                color: #fff;
                cursor: pointer;
                border-radius: 3px;
                padding: 0 36px 0 36px;
                height: 44px;
                line-height: 44px;
                font-size: 16px;
                font-family: MicrosoftYaHei;
                font-weight: 400;
                display: inline-block;
                text-align: center;
            }
        }
    }
}

/*!footer*/
.footer{
    font-size: $f-size12;
    overflow: hidden;
    line-height: 22px;
    border-top: 1px solid #ebebeb;
    background-color: #fcfcfc;
    color: #4d4d4d;
    // 文字部分
    .footer-inner{
        width: 960px;
        margin: 0 auto;
        overflow: hidden;
        // 精灵图服务保障
        .footer-vip{
            margin-left: 79px;
            li{
                float: left;
                i{
                    display: block;
                    margin-top: 30px;
                    margin-right: 38px;
                    margin-left: 10px;
                    width: 72px;
                    height: 75px;
                    font-size: 0;
                    text-indent: -100%;
                    background: url(../imgs/bottom/精灵图.png) no-repeat;
                }
                .foot-ic-1{
                    background-position: 0 0;
                }
                .foot-ic-2{
                    background-position: -123px 0;
                }
                .foot-ic-3{
                    background-position: -245px 0;
                }
                .foot-ic-4{
                    background-position: -369px 0;
                }
                .foot-ic-5{
                    background-position: -492px 0;
                }
                .foot-ic-6{
                    background-position: -615px 0;
                }
                .foot-ic-7{
                    background-position: -738px 0;
                }
            }
        }
        // 服务列表
        .footer-list{
            margin: 37px 0 25px;
            line-height: 20px;
            dt{
                margin-bottom: 4px;
                color: #4d4d4d;
            }
            .list-item{
                float: left;
                width: 145px;
                height: 146px;
                padding-left: 16px;
                border-right: 1px solid #e0e0e0;
                dd{
                    padding-left: 8px;
                    background: url(../imgs/bottom/小图标/fangkuai.png) no-repeat -6px -494px;
                    a{
                        color: grey;
                    }
                    a:hover{
                        color: #f10180;
                    }
                }
            }
            .list-item dd:hover{
                transform: translateX(2px);
                background-position: -6px -513px;
                transition: transform ease-out .2s;
            }
            .list-ewm{
                float: left;
                height: 146px;
                border-right: 0;
                padding-left: 0;
                width: 136px;
                text-align: center;
                img{
                    width: 100px;
                    height: 100px;
                }
            }
            
        }
        // 下方小字
        .bottom{
            text-align: center;
            color: #fff;
            .bottom-link{
                background-color: #d7237e;
                line-height: 30px;
                a{
                    margin-left: 2px;
                    margin-right: 2px;
                    color: #fff;
                }
                a:hover{
                    color: #ccc;
                    }
                }
            }
            .bottom-txt{
                color: #999;
                margin: 14px 0;
                line-height: 19px;
                a{
                    color: grey;
                    img{
                        margin: 2px 3px 0 0;
                        width: 14px;
                        height: 14px;
                    }
                }
                a:hover{
                    color: #f10180;
                }
            }
    }
}
    // 许可证
    .footer-foot{
        padding: 4px 0 4px;
        background-color: #fff;
        .foot-pic{
            margin: 0 auto;
            width: 960px;
            height: 40px;
            text-align: center;
            overflow: hidden;
            a{
                i{
                    display: inline-block;
                    margin-right: 9px;
                    height: 40px;
                    background-image: url(../imgs/bottom/小图标/fangkuai.png);
                    background-repeat: no-repeat;
                }
                .ico-1{
                    width: 99px;
                    background-position: 0 -150px;
                }
                img{
                    width: 75px;
                    vertical-align: top;
                    margin-top: 6px;
                }
                .ico-2{
                    width: 76px;
                }
                .ico-4{
                    width: 76px;
                    background-position: 0 -450px;
                }
            }
        }
    }


/*!侧边固定栏*/
.sidebar{
    position: fixed;
    right: 0;
    top: 0;
    z-index: 999;
    width: 36px;
    height: 100%;
    font-family: "Microsoft YaHei";
    .side-nav{
        position: relative;
        z-index: 101;
        height: 100%;
        background-color: #262626;
        .nav-cont{
            margin-top: -250px;
            height: 400px;
            position: absolute;
            top: 50%;
            right: 0;
            // 侧边固定栏列表
            ul{
                display: block;
                li{
                    position: relative;
                    width: 36px;
                    text-align: center;
                    cursor: pointer;
                    margin-bottom: 2px;
                    background-color: #262626;
                    >div{
                        font-family: vipSidebarFont;
                        line-height: 18px;
                        color: #fff;
                        font-size: 12px;
                        padding: 8px 0 6px;
                        i{
                            position: relative;
                            display: block;
                            width: 36px;
                            font-size: 26px;
                        }
                    }
                }
                li:hover{
                    background-color: #df147f;
                }
                .car{
                    background-color: #df147f;
                    color: #fff;
                    padding: 25px 0;
                    font-size: 14px;
                    line-height: 20px;
                    i{
                        font-size: 24px;
                    }
                    p{
                        margin-top: 5px;
                    }
                    span{
                        color: #df147f;
                        display: block;
                        background-color: #fff;
                        margin: 5px auto 0;
                        width: 18px;
                        height: 18px;
                        line-height: 18px;
                        border-radius: 50%;
                        position: relative;
                    }
                }
                .quan,.like,.star,.time{
                    margin: 5px 0;
                    font-size: 14px;
                    p{
                        position: absolute;
                        right: -130px;
                        top: 0;
                        z-index: -1;
                        width: 100px;
                        height: 32px;
                        line-height: 32px;
                        padding: 0 8px;
                        box-sizing: border-box;
                        border-radius: 3px 0 0 3px;
                        background-color: #fff;
                        border: 1px solid #ddd;
                        border-right: none;
                        font-size: 14px;
                        text-align: center;
                        transition: .3s linear;
                        color: #333;
                    }
                }
                .quan:hover p,.like:hover p,.star:hover p,.time:hover p{
                    right: 36px;
                }
            }
        }
    }
}
// @media screen and (max-height: 768px){ 
//     .nav-cont li{
//         margin-bottom: 2px;
//     }
// }